import Vue from "vue";
import VueRouter from "vue-router";
import UI_Router from "@/views/UI_Router.vue";
import MyContacts from "@/views/MyContacts.vue";
import MyAbout from "@/views/MyAbout.vue";
import ALLContacts from "@/views/ALLContacts.vue";
import ContactsAlice from "@/views/ContactsAlice.vue";
import ContactsBob from "@/views/ContactsBob.vue";
import BobBlog from "@/views/BobBlog.vue"
import BobFax from "@/views/BobFax.vue"
Vue.use(VueRouter);

const router = new VueRouter({
  routes: [
    { path: "/ui-router", component: UI_Router },
    {
      path: "/contacts",
      component: MyContacts,
      children: [
        { path: "all", component: ALLContacts },
        { path: "alice", component: ContactsAlice },
          {
              path: "bob",
              component: ContactsBob,
              children: [
                  { path: 'blog', component: BobBlog },
                  { path: 'fax', component: BobFax },
              ]
          },
      ],
    },
    { path: "/about", component: MyAbout },
  ],
});

export default router;
